<template>
  <div class="particulars">
    <div class="logo">
      <span></span>
      <span>充值详情</span>
    </div>
    <div class="patient">
      <div class="logo">患者信息</div>
      <patient :setPatient="DetailsData"></patient>
    </div>
    <div class="patient">
      <div class="logo">订单信息</div>
      <order :setOrder="DetailsData"></order>
    </div>
  </div>
</template>

<script setup>
import patient from "../../components/home_wxq/feng/patient.vue";
// import stationierung from "../../components/home_wxq/feng/Stationierung.vue";
import order from "../../components/home_wxq/feng/order.vue";
import { useRoute } from "vue-router";
const route = useRoute();
let DetailsData = JSON.parse(route.params.detailsDtat);
</script>

<style lang="scss">
* {
  margin: 0;
  padding: 0;
}
.particulars {
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;
  //logo
  .logo {
    display: flex;
    flex-direction: row;
    align-items: center;
    span:nth-of-type(1) {
      display: inline-block;
      width: 30px;
      height: 10px;
      background-color: #006eff;
      border-radius: 35%;
      margin-right: 2%;
    }
    span:nth-of-type(2) {
      font-size: 25px;
    }
  }

  //中间
  .patient {
    margin-top: 30px;
    //中上
    .logo {
      background-color: #f2f2f2;
      color: #006eff;
      line-height: 50px;
      height: 50px;
      padding-left: 2%;
    }
  }
}
</style>